html,body{
    height: 100%;
}
@mixin px2rem($name, $px){
    #{$name}: $px / 75 * 1rem;
}
.gouwuc {
                 .shopCart {
                   position: relative;
                    width: 30%;
                    margin: 0 auto;
                    .cartNum {
                        display: block;
                        position: absolute;
                         @include px2rem(top,-7);
                         @include px2rem(left,9);
                       @include px2rem(height,20);
                       @include px2rem(width,20);
                        @include px2rem(border-radius,10);
                        background: rgba(45,245,245,0.5);
                        text-align: center;
                     
                       
                    }
                }
            }

.boxFlex{
    display: -webkit-box;
    display: flex;
}
.footer{
    width: 100%;
    position: fixed;
    bottom: 0;
     @include px2rem( height,100);
    background: #000000;
    color: white;
    @extend .boxFlex;
    ul{
        @extend .boxFlex;
        justify-content:space-around;
        align-items: center;
        flex:1;
        width: 100%;

        li{
           @include px2rem( width,80);
          @include px2rem( height,60);
           @include px2rem( padding-top,20);
           
           text-align: center;
            &:hover{
                background: rgba(255,255,255,0.5);
                 @include px2rem( border-radius,8);
            }
            img{
                margin: 0 auto;
                @include px2rem(padding-bottom,10);
               @include px2rem(height,30);
                @include px2rem(width,30);
               
                display: block;
            .cont{
                text-align: center;
                display: block
            }
            }
        }
    }
}
